<div class="row">
    <div class="col-lg-12">
        <div class="panel panel-default">
            <div class="panel-body">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="row">
                            <div class="col-lg-8">
                                <strong>Báo cáo bán hàng</strong>
                            </div>
                             <div class="col-lg-2 pull-right">
                            <form method="POST" action="<?php echo $this->baseUrl()?>/kinhdoanh/report3/export?type=1&fromdate=<?php echo $this->fromdate ?>&todate=<?php echo $this->todate ?>&product_id=<?php echo $this->product_id ?>&groupproduct_id=<?php echo $this->groupproduct_id ?>&agentbuyer_id=<?php echo $this->agentbuyer_id ?>&agentseller_id=<?php echo $this->agentseller_id ?>">
                                <button class="btn btn-primary" id="submit">Xuất excel</button>  
                            </form>
                        </div>
                        </div>
                        
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-lg-12">
        <div class="panel panel-default">
            <div class="panel-body">
                <div class="row">
                    <div class="col-lg-12">
                        <form role="form" method="POST" name="Report3">
                            <div class="row">
                                <div class="col-lg-2">
                                    Từ ngày:
                                </div>
                                <div class="col-lg-3">
                                    <input class="form-control" type="datetime" name="from_date" id="from_date" value="<?php echo $this->fromdate; ?>">        
                                </div>
                                <div class="col-lg-2">
                                    Đến:
                                </div>
                                <div class="col-lg-3">
                                    <input class="form-control" type="datetime" name="to_date" id="to_date" value="<?php echo $this->todate; ?>">        
                                </div>
                                <div class="col-lg-2">
                                    <button type="submit" class="btn btn-primary">Xem báo cáo</button>   
                                </div>
                            </div>
                            <div class="row">
                                
                                <div class="col-lg-2">
                                    Khách hàng
                                </div>
                                <div class="col-lg-3" id="agent">
                                     <?php echo $this->agentbuyerHTML ?>   
                                </div>
                                <div class="col-lg-2">
                                    Sản phẩm
                                </div>
                                <div class="col-lg-3">
                                    <?php echo $this->productHTML ?> 
                                </div>
                                <div class="col-lg-2">
                                    
                                </div>
                            
                         </div>
                            <div class="row">
                                
                                <div class="col-lg-2">
                                   Nguồn mua
                                </div>
                                <div class="col-lg-3" id="agent">
                                    <?php echo $this->agentsellerHTML ?>   
                                </div>
                                <div class="col-lg-2">
                                    Nhóm sản phẩm
                                </div>
                                <div class="col-lg-3">
                                    <?php echo $this->groupproductHTML ?> 
                                </div>
                                <div class="col-lg-2">
                                    
                                </div>
                            
                         </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    $(document).ready(function(){
        $('#from_date').datepicker({showAnim: 'drop', dateFormat: 'dd/mm/yy', showWeek: false, showButtonPanel: false,

          });    
        $('#to_date').datepicker({showAnim: 'drop', dateFormat: 'dd/mm/yy', showWeek: false, showButtonPanel: false,

          });
    });
    $('#product_id').multiselect({
         includeSelectAllOption:true,
            enableFiltering: true,
            maxHeight: '300',
            buttonText: function(options) 
            {
                var retStr = "";
                if (options.length === 0) {
                   retStr = "None selected";
                } else if(options.length <=2){
                   var textArray = [];
                   $.each(options,function(key,value){
                       textArray.push($.trim($(value).html()));
                   });
                   retStr = "<div class='pull-left restricted'>"+textArray.join(",")+"</div>";
                } else {
                   retStr = options.length+" selected";
                }
                return retStr+" <b class='caret'></b>";
            }  
        });
    $('#groupproduct_id').multiselect({
         includeSelectAllOption:true,
            enableFiltering: true,
            maxHeight: '300',
            buttonText: function(options) 
            {
                var retStr = "";
                if (options.length === 0) {
                   retStr = "None selected";
                } else if(options.length <=2){
                   var textArray = [];
                   $.each(options,function(key,value){
                       textArray.push($.trim($(value).html()));
                   });
                   retStr = "<div class='pull-left restricted'>"+textArray.join(",")+"</div>";
                } else {
                   retStr = options.length+" selected";
                }
                return retStr+" <b class='caret'></b>";
            }  
        });
    $('#agentbuyer_id').multiselect({
         includeSelectAllOption:true,
            enableFiltering: true,
            maxHeight: '300',
            buttonText: function(options) 
            {
                var retStr = "";
                if (options.length === 0) {
                   retStr = "None selected";
                } else if(options.length <=1){
                   var textArray = [];
                   $.each(options,function(key,value){
                       textArray.push($.trim($(value).html()));
                   });
                   retStr = "<div class='pull-left restricted'>"+textArray.join(",")+"</div>";
                } else {
                   retStr = options.length+" selected";
                }
                return retStr+" <b class='caret'></b>";
            }        
        });
    $('#agentseller_id').multiselect({
         includeSelectAllOption:true,
            enableFiltering: true,
            maxHeight: '300',
            buttonText: function(options) 
            {
                var retStr = "";
                if (options.length === 0) {
                   retStr = "None selected";
                } else if(options.length <=1){
                   var textArray = [];
                   $.each(options,function(key,value){
                       textArray.push($.trim($(value).html()));
                   });
                   retStr = "<div class='pull-left restricted'>"+textArray.join(",")+"</div>";
                } else {
                   retStr = options.length+" selected";
                }
                return retStr+" <b class='caret'></b>";
            }  
        });
</script>
<div class="row">  
    <div class="col-lg-12">
        <div class="panel panel-default">
            <div class="panel-body">
                <div class="row">
                    <div class="panel-body">
                        <div class="table-reponsive">
                            <div id="jqxgrid">
                            </div>
                        </div>
                    </div>  
                </div>
            </div>
        </div>
    </div>
</div>
  
    <script type="text/javascript">
        $(document).ready(function () {
            // prepare the data
            
            var source =
            {
                datatype: "json",
                datafields:
                [
                    { name: 'id',type:'int'},
                    { name: 'buyer_name', type: 'string' },   
                    { name: 'seller_name', type: 'string' },                           
                    { name: 'province_name', type: 'string' },
                    { name: 'quantity', type: 'int' },
                    { name: 'product_name', type: 'string' },                    
                    { name: 'order_created', type: 'string' },                    
                    { name: 'charges', type: 'float' }
            
                ],                
                url:'<?php echo $this->baseUrl() ?>/kinhdoanh/report3/service',
                data: {
                    fromdate: "<?php echo $this->fromdate; ?>",
                    todate: "<?php echo $this->todate; ?>",
                    product_id: "<?php echo $this->product_id; ?>",
                    groupproduct_id: "<?php echo $this->groupproduct_id; ?>",
                    agentbuyer_id: "<?php echo $this->agentbuyer_id; ?>",
                    agentseller_id: "<?php echo $this->agentseller_id; ?>"
                },
                sortcolumn: 'charges',
                sortdirection: 'desc'
               
            };
         var dataAdapter = new $.jqx.dataAdapter(source, {
                loadComplete: function () {
                }
            });
            var cellsrenderer = function (row, column, value) {
                return '<div style="text-align: left; margin-top: 5px;">&nbsp' +value + '</div>';
            };
            $("#jqxgrid").jqxGrid(
            {
                width: '100%',
                source: dataAdapter,  
                theme: 'bootstrap',
                pageable: true,
                showfilterrow: true,
                filterable: true,
                autoheight: true,
                sortable: true,
                altrows: true,
                enabletooltips: true,
                selectionmode: 'multiplecellsadvanced',
                columnsResize: true,
                showaggregates: true,
                 showstatusbar: true,
                statusbarheight: 20,
                rendergridrows: function (params) {
                    return params.data;
                },
                ready: function () {
                    $("#jqxgrid").jqxGrid('hideColumn', 'id');
                },
                columns: [
                    {text:'id',dataField:'id',cellsalgin:'right',width:0},
                  { text: ' Tên Khách Hàng',cellsrenderer: cellsrenderer,editable: false, dataField: 'buyer_name', width: '20%' },
                  { text: 'Khu vực (Tỉnh)',cellsrenderer: cellsrenderer, editable: false, dataField: 'province_name', width: '10%' },
                  { text: 'Loại hàng',cellsrenderer: cellsrenderer,editable: false, dataField: 'product_name', width: '15%' },
                  { text: 'Khối lượng',cellsrenderer: cellsrenderer, editable: false, dataField: 'quantity', width: '10%',aggregates: ['sum'] },
                  { text: 'Thời điểm (Ngày Tháng Năm)',cellsrenderer: cellsrenderer, editable: false, dataField: 'order_created', width: '15%' },
                  { text: 'Nguồn (Mua Của ĐL/CH)',cellsrenderer: cellsrenderer, editable: false, dataField: 'seller_name', width: '20%' },                 
                  { text: 'Điểm',cellsrenderer: cellsrenderer, editable: false, dataField: 'charges', width: '10%',aggregates: ['sum'] },
                  { text: 'Ghi Chú',cellsrenderer: cellsrenderer, editable: false, dataField: '', width: '10%' }
                ]
            });
           
        });
    </script>    


    
